
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Title</title>

<link href="css/index.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript"> 
$(function(){
	
	// 移到留言上可以删除,编辑-------------------------------------------
		$('#mian .list .onep').hover(function() {
			$(this).find('a').show();
			$(this).find('.edit_a').show();
			$(this).find('.content').addClass('content1');
		}, function() {
			$(this).find('a').hide();
			$(this).find('.edit_a').hide();
			$(this).find('.content').removeClass('content1');
		});

   // 留言方式的切换------------------------------------------------
		var c=1;
		$('.close').click(function(event) {
			if(c==1){
				$('#right').stop().animate({"top": 800+'px'},2000).parent().parent().find('#bottom_out').stop().animate({"bottom": 0+'px'},3000);
				c=0;
			}else{
				$('#right').stop().animate({"top": 50+'px'},2000).parent().parent().find('#bottom_out').stop().animate({"bottom": -120+'px'},3000);
				c=1;
			}
		});

       //var lin = $('#right input[name="username"]');
       //lin.val("你不错的！");


       //var nickname = $('#right input[name="username"]');

       //var content = $('#right textarea');

       //$('#right input[name="username"]').eq(2).attr("checked",true);
	
	
});


var url = "getRowbyID";
function onUpdate(id){
	$.get(url,{id:id},
		function(data){
			var data = eval("("+data+")");
			/*if(data.status==1){
				$("#right input[name="username"]").val(data.info.username);
				for(var i=0;i<2;i++){
					str = "男";
					if(str===data.info.sex){
						$('#right input:radio[name="sex"]').eq(i).attr("checked",true);
						break;

					}
				}
				/*$('#right input[name="message"]').text(data.info.content);
				for(var i=1;i<5;i++){
					if(str ="images/"+i+".jpg");
					  $(str===data.info.avater){
					  	$("#right input:radio[name='imgurl']").eq(i-1).attr("checked",true);
						break;
					  }
				}
			}else{

			}*/
		});
	}


 
function onUpdate(id){
    //alert("你点击了修改元素！"+id);  //测试，当点击a元素时，是否正确触发。
    var URL = "get_row_byid.php";
    var URL2 = "update_form.php";
    //alert(form.action);
    var form =$('#right form');  //取得当前表单元素
    form.prop('action',URL2);  //property
    form.prepend('<input type="hidden" name="id" value="'+id+'"/>');  //append()
    $('#right input[type="submit"] ').val('更新');
    $.get(URL,{sid:id},function(data){  //$==> jQuery.get $_GET 异步请求 Action=  // {sid:id}   // 回调函数
        var data = eval("(" + data + ")");  //将json字符串 转换成json 对象结构     data.status
        if(data.status===1){
            // 正确的反返回
            info = data.info;  // info,id=3  info.username=abc   info.sex=m  info.content.fsddd   info.time
            $('input[name="username"]').val(info.username);// 取得昵称输入框元素，修改它的值  val() == >value=info.username
            $('textarea[name="message"]').text(info.content); 
            // 男和女的选择
            var sexEle = $('#right input:radio[name="sex"]');
            for(i=0;i<2;i++){
                if(sexEle.eq(i).val()===info.sex){
                    sexEle.eq(i).prop('checked',true); // attr()  property
                }
            }
            //头像的选择
        var contentEle = $("#right input:radio[name='imgurl']");
        for(var i=1;i<5;i++){
            str = "images/"+i+".jpg";
            if(str===info.avater){
                contentEle.eq(i-1).prop("checked",true);
            }
        }
        }else{
              alert("没有符合条件的数据信息");
        }
    });
    
}
</script>

</head>

<body>
<div id="top">
		<h1>留言板
<?php
session_start();
if(isset($_SESSION['uid'])){
    echo "welcome." . $_SESSION['uname'];
    echo "<span><a href='register.html' >注销</a></span>";
}else {
    header("Location: register1.html");
    exit();
}


?>
</h1>
</div>

<div id="mian_out">
	  <div id="mian">
			<h2>其它人都说了什么</h2>
			<ul class="list">
      					<li class="onep">
         <?php
           require_once 'zeka.php';
           $sql = "SELECT * FROM  t_message ";
           $result = $conn->query($sql);
         ?>
            <?php 
             $rows = $result->fetch_all(MYSQLI_ASSOC);
             foreach($rows as $row): ?>
                                        <li class="onep">
                                            <p class="pic"><img src="<?php echo $row['avater'] ; ?>" alt=""/></p>
                                            <p class="name"><?php echo $row['username']   ; ?></p>
                                            <p class="content"><?php echo $row['content']   ; ?>
                                            </p>
                                            <!--a class="edit_a" href="javascript:" onclick="if(confirm('确定修改吗？')) location.href='#'">修改</a-->
                                            <a class="edit_a" href="javascript:" onclick="onUpdate(<?php echo $row['id'];?>)">修改</a>
                                            <a class="delete" href="javascript:" onclick="if(confirm('确定修改吗？')) location.href='#'">删除</a>
                                        </li> 
             <?php endforeach;?>                       
				        </ul>
   </div>
   
   <div id="right">
			<h2>留下你的脚步吧</h2>
			<form action="upadd.php" method="post">
				<p class="one">
				昵称:<input class="name" name="username" type="text" placeholder="你的名字" />
				<input type="radio" name="sex" value="男" checked="checked" />男侠
				<input type="radio" name="sex" value="女" />女侠
				</p>
				<p><textarea name="message" placeholder="这个人很懒,什么都没有写" ></textarea></p>
				<p class="tow">
                                     <?php 
                                     $imgarr = array(1,2,3,4);
                                     ?>
                                    <?php foreach ($imgarr as $value ) : ?>
                                    <input type="radio" name="imgurl" value="images/<?php echo $value; ?>.jpg"/><img src="images/<?php echo $value; ?>.jpg" alt=""/>
                                    <?php endforeach; ?>
					<!--<input type="radio" name="imgurl" value="images/1.jpg" checked="checked" /><img src=" images/1.jpg" alt="" />
					<input type="radio" name="imgurl" value="images/2.jpg" /><img src=" images/2.jpg" alt="" />
					<input type="radio" name="imgurl" value="images/3.jpg" /><img src=" images/3.jpg" alt="" />
					<input type="radio" name="imgurl" value="images/4.jpg" /><img src=" images/4.jpg" alt="" /-->
				</p>
				<p class="thr"><input class="btn" type="submit" value="提交" /></p>
			</form>
			<div class="close"></div>
</div>
   
</div>

<div id="bottom_out">
		<div id="bottom">
			<form action="upadd.php" method="post">
				<p class="one">
				昵称:<input class="name" name="username" type="text" placeholder="大爷你的名字" />
				<br/><br/>
				<input type="radio" name="sex" value="男" checked="checked" />男侠
				<input type="radio" name="sex" value="女" />女侠
				</p>
				<p><textarea name="message" placeholder="这个人很懒,什么都没有写" ></textarea></p>
				<p class="tow">
					<input type="radio" name="imgurl" value="images/1.jpg" checked="checked" /><img src=" images/1.jpg" alt="" />
					<input type="radio" name="imgurl" value="images/2.jpg" /><img src=" images/2.jpg" alt="" />
					<input type="radio" name="imgurl" value="images/3.jpg" /><img src=" images/3.jpg" alt="" />
					<input type="radio" name="imgurl" value="images/4.jpg" /><img src=" images/4.jpg" alt="" />
				</p>
				<p class="thr"><input class="btn" type="submit" value="提交" /></p>
			</form>
			<div class="close"></div>
		</div>
</div>

</body>
</html>

